import PropTypes from 'prop-types'
import React, { memo } from 'react'
import { FooterWrapper } from './style'
import IconMoreArrow from '@/assets/svg/icon-more-arrow'
import { useNavigate } from 'react-router-dom'

const SectionFooter = memo((props) => {
  /**
   * 内部状态逻辑
   */
  const {name } = props
  // 显示的标题
  let showTitle="显示更多"
  // 如果接收到了name(有tab的组件才会传name过来)
  if(name){
    showTitle=`显示更多${name}房源`
  }


  /**
   * 事件处理逻辑
   */
  // 跳转到详情页
  const navigate=useNavigate()
  const handleClickMore=(()=>{
    navigate("/entire")
  })
  return (
    <FooterWrapper color={name? "#00848A":"#000"}>
        <div className="info" onClick={handleClickMore}>
            <span className='text'>{showTitle}</span>
            <IconMoreArrow/>
        </div>
    </FooterWrapper>
  )
})

SectionFooter.propTypes = {
    name:PropTypes.string
}

export default SectionFooter